<template>
	<view class="menu-box left clearfix">
		<view class="menu-breadcrumb left clearfix">
			<uni-breadcrumb separator="/" style="width:300px;float:left;">
			  <uni-breadcrumb-item v-for="(route,index) in routes" :key="index" :to="route.to">
			    {{route.name}}
			  </uni-breadcrumb-item>
			</uni-breadcrumb>
			<view class="add-bottons right" @click="navigateToAdd()">
				新增分组
			</view>
		</view>
		
		<view class="menu-content left clearfix">
			<view class="menu-table left clearfix">
				<!--头部-->
				<view class="menu-tr left clearfix" style="font-weight:bold;color:#909399">
					<view class="menu-sort left">
						序号
					</view>
					<view class="menu-title left" style="padding-left:10px;">
						标题
					</view>
					
					
					<view class="menu-title left" style="width:300px;">
						说明
					</view>
					<view class="menu-title left" style="width:100px;">
						系统/超级
					</view>
					<view class="menu-title left" style="width:150px;border-right:none;">
						操作
					</view>
				</view>
				
				
				
				
				<view  v-for="(item,index) in data">
				<view class="menu-tr left clearfix" style="color:#606266;">
					<view class="menu-sort left">
						{{index + 1}}
					</view>
					<view class="menu-title left" style="text-align: left;padding-left:10px;">
						<label>
							 {{item.title}}
						</label>
						
					</view>
					
					<view class="menu-title left" style="width:300px;">
						{{item.desc}}
					</view>
					<view class="menu-title left" style="width:100px;text-align: center;">
						<label v-if="item.is_admin==false" style="color:#ccc;width:100px;float:left;text-align: center;">
							--
						</label>
						<label v-else-if="item.is_admin==true" style="width:100px;float:left;text-align: center;">
							<uni-icons type="icon-duigou3" size="16" color="#00c296" custom-prefix="iconfont"></uni-icons>
						</label>
					</view>
					<view class="menu-title left" style="width:150px;border-right:none;padding-left:5px;">
						
						
						<view class="buttons left" @click="navigateToAdd(item._id)">
							修改
						</view>
						
						<view class="buttons-del left" @click="remove(item,index)">
							删除
						</view>
						
					</view>
					
					
					
				</view>
				
				
				</view>
				
				
				
				
				
				
				
			</view>
		</view>
	</view>
</template>

<style scoped lang="scss">
	.uni-forms-item__label{width:60px !important;}
	.form-quxiao-submit{width:80px;line-height:35px;height:35px;color:#666;border-radius: 5px;text-align: center;border:1px solid #ccc;margin-right:20px;cursor:pointer;font-size:14px;}
	.form-submit{width:80px;line-height:35px;height:35px;background:#2979ff;color:#fff;border-radius: 5px;text-align: center;margin-right:20px;cursor:pointer;font-size:14px;}
	.add-content{width:80%;margin-left:10%;margin-top:40px;}
	.add-title label:last-child{float:right;line-height:40px;height:40px;margin-right:20px;font-size:14px;color:#333;}
	.add-title label:first-child{float:left;line-height:40px;height:40px;margin-left:20px;font-size:14px;color:#333;font-weight:500;}
	.add-title{width:100%;line-height:40px;height:40px;border-bottom:1px solid #eee;}
	.add-box{width:600px;height:500px;background:#fff;border-radius: 12px;}
	.menu-title label{float:left;margin-right:5px;}
	.menu-title{width:calc(100% - 670px);height:45px;border-right:1px solid #eee;line-height:45px;text-align:center;font-size:15px;}
	.menu-sort{width:100px;height:45px;line-height:45px;text-align:center;font-size:14px;border-right:1px solid #eee;}
	.menu-tr:hover{background:#f8f8f8;}
	.menu-tr{width:100%;height:45px;border-bottom:1px solid #eee;}
	.menu-table{width:100%;border:1px solid #eee;border-bottom:none;}
</style>

<script>
	var db = uniCloud.database();
	export default {
		name:"system-menu",
		data() {
			return {
				
				data:[],
				routes: [
				        {
				          to: "/A",
				          name: "权限管理",
				        },
				        {
				          to: "/B",
				          name: "权限组管理",
				        }
				      ]
			};
		},
		props:{
			id:{
				type:String,
				default:''
			}
		},
		mounted() {
			var that = this;
			this.getData();
		},
		methods:{
			//跳转到添加页面
			navigateToAdd(id=null){
				uni.navigateTo({
					url: '/pages/index/index?page=userinfo-role-add&id='+id
				});
			},
			//删除
			remove(item,index){
				var that = this;
				uni.showModal({
					title: '提示',
					content: '确定要删除吗？',
					success: function (res) {
						if (res.confirm) {
							if(item && item._id){
								db.collection('userinfo_group').where({_id:item._id}).remove().then(result=>{
									that.data.splice(index,1);
								});
							}
						}
					}
				});
			},
			//获取菜单列表
			getData(){
				uni.showLoading({
					title:'加载中'
				})
				db.collection('userinfo_group').orderBy('_id asc').get().then(res=>{
					console.log('查询结果',res.result.data);
					uni.hideLoading();
					this.data = res.result.data;
				}).catch(err=>{
					uni.hideLoading();
				});
			}
		}
	}
</script>
